<%--
  Created by IntelliJ IDEA.
  User: 米兰的小铁匠
  Date: 2020/6/9
  Time: 18:32
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<html>
<meta charset="UTF-8">
<head>
    <title>Title</title>
</head>
<link rel="stylesheet" href="utilLib/bootstrap.min.css" type="text/css" media="screen" />
<body>
<!--头部-->
<header>
    <div class="logo">
        <a href="http://localhost:8080/login_war_exploded/login.html">管理员登录</a>
        <div class="search">
            <div class="search_txt">
                <input type="text" placeholder="请输入关键字搜索">
                <div class="search_img"></div>
            </div>
        </div>
    </div>
    <ul>
        <li>网站首页</li><li>学院概况</li><li>本科生教育</li><li>研究生教育</li><li>科学研究</li>
        <li>学生工作</li><li>招生工作</li><li>实验中心</li><li>党建之窗</li><li>抗击疫情</li>
    </ul>
    <img src="img/colonavirus.jpg">
</header>

<!--中部-->
<main>
    <div class="left_news">
        <div class="tupian">
            <div class="left_daohang">
                <div>图片新闻</div>
                <div></div>
            </div>
            <div class="tupian_main">
                <img src="img/NewsImg.jpg">
                <ul>
                    <c:forEach var="news" items="${lstNews}" >
                        <c:choose>
                            <c:when test="${news.category == '图片新闻'}">
                                <div class="newsItem"><a href="ShowNewsServlet?newid=${news.newsID}" class="del_btn">
                                    <li>${news.title}</li>
                                    <div class="newsDate">${news.newsDate}</div>
                                </a></div>
                            </c:when>
                        </c:choose>
                    </c:forEach>
                </ul>
            </div>
        </div>
        <div class="sudi">
            <div class="left_daohang">
                <div>新闻速递</div>
                <div></div>
            </div>
            <div class="sudi_main">
                <div class="showNews">
                    <span>思政教育“不下线”,计科院成立湖北籍学生临时团支部</span></br>
                    <p>我宣誓，听从召唤，坚持抗疫，为打赢疫情防控阻击战贡献青春力量</p>
                </div>
                <ul>
                    <c:forEach var="news" items="${lstNews}" >
                        <c:choose>
                            <c:when test="${news.category == '新闻速递'}">
                                <div class="newsItem"><a href="ShowNewsServlet?newid=${news.newsID}" class="del_btn">
                                    <li>${news.title}</li>
                                    <div class="newsDate">${news.newsDate}</div>
                                </a></div>
                            </c:when>
                        </c:choose>
                    </c:forEach>
                </ul>
            </div>
        </div>
        <div class="gonggao">
            <div class="left_daohang">
                <div>通知公告</div>
                <div></div>
            </div>
            <div class="gonggao_main">
                <ul>
                    <c:forEach var="news" items="${lstNews}" >
                        <c:choose>
                            <c:when test="${news.category == '通知公告'}">
                                <div class="newsItem"><a href="ShowNewsServlet?newid=${news.newsID}" class="del_btn">
                                    <li>${news.title}</li>
                                    <div class="newsDate">${news.newsDate}</div>
                                </a></div>                            </c:when>
                        </c:choose>
                    </c:forEach>
                </ul>
            </div>
        </div>
    </div>
    <div class="right_news">
        <div class="xuesu">
            <div class="right_daohang">学术交流</div>
            <ul>
                <c:forEach var="news" items="${lstNews}" >
                    <c:choose>
                        <c:when test="${news.category == '学术交流'}">
                            <div class="newsItem"><a href="ShowNewsServlet?newid=${news.newsID}" class="del_btn">
                                <li>${news.title}</li>
                                <div class="newsDate">${news.newsDate}</div>
                            </a></div>                        </c:when>
                    </c:choose>
                </c:forEach>
            </ul>
        </div>
        <div class="dangjian">
            <div class="right_daohang">党建动态</div>
            <ul>
                <c:forEach var="news" items="${lstNews}" >
                    <c:choose>
                        <c:when test="${news.category == '党建动态'}">
                            <div class="newsItem"><a href="ShowNewsServlet?newid=${news.newsID}" class="del_btn">
                                <li>${news.title}</li>
                                <div class="newsDate">${news.newsDate}</div>
                            </a></div>                        </c:when>
                    </c:choose>
                </c:forEach>
            </ul>
        </div>
        <div class="zhuanti">
            <div class="right_daohang">专题列表</div>
            <ul>
                <c:forEach var="news" items="${lstNews}" >
                    <c:choose>
                        <c:when test="${news.category == '专题列表'}">
                            <div class="newsItem"><a href="ShowNewsServlet?newid=${news.newsID}" class="del_btn">
                                <li>${news.title}</li>
                                <div class="newsDate">${news.newsDate}</div>
                            </a></div>                        </c:when>
                    </c:choose>
                </c:forEach>
            </ul>
        </div>
    </div>
</main>
<%--底部--%>
<footer>
    <div class="swpu">Copyright© 2018 All Rights Reserved. 西南石油大学计算机科学学院</div>
</footer>
</body>
<style>
    /*头部*/
    header{
        width: 970px;
        height: 370px;
        margin: 0 auto;
    }
    .logo{
        width: 970px;
        height: 110px;
        background: url("img/top-bg.jpg");
    }
    .logo a{
        float: left;
    }
    .search_txt{
        width: 280px;
        height: 35px;
        float: right;
        margin-top: 37px;
    }
    .search_txt input{
        width: 237px;
        height: 30px;
    }
    .search_img{
        width: 35px;
        height: 35px;
        float: right;
    }
    header ul{
        width: 970px;
        height: 35px;
        list-style-type: none;
        margin: 0;
        padding: 0;
        overflow: hidden;
        background-color: #0c89ff;
    }
    header li{
        width: 97px;
        float: left;
        text-align: center;
        line-height: 35px;
    }
    header img{
        width: 970px;
        height: 225px;
        background-color: #2a6496;
    }
    /*中部*/
    main{
        width: 970px;
        height: 950px;
        margin: 0 auto;
    }
    .left_news{
        width: 640px;
        height: 900px;
        margin-top: 20px;
        float: left;
    }
    .tupian{
        width: 640px;
        height: 260px;
    }
    .left_daohang{
        width: 640px;
        height: 35px;
        background-color: #DDDDDD;
        line-height: 35px;
        margin-bottom: 10px;
        font-size: 16px;
        font-weight: bold;
    }
    .tupian_main img{
        width: 310px;
        height: 210px;
        float: left;
        margin-right: 38px;
    }
    .tupian_main ul{
        margin: 0;
        padding: 0;
        float: left;
        font-size: 14px;
    }

    .tupian_main li{
        width: 210px;
        height: 35px;
        color: black;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        float: left;
    }
    .newsDate{
        width: 60px;
        height: 35px;
        margin-left: 10px;
        float: left;
        color: #b8b8b8;
    }
    .sudi{
        width: 640px;
        height: 320px;
    }
    .showNews{
        width: 640px;
        height: 60px;
    }
    .sudi_main ul{
        margin: 0;
        padding: 0;
        float: left;
        font-size: 14px;
    }
    .sudi_main li{
        width: 540px;
        height: 35px;
        margin-left: 20px;
        color: black;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        float: left;
    }
    .gonggao_main ul{
        margin: 0;
        padding: 0;
        float: left;
        font-size: 14px;
    }
    .gonggao_main li{
        width: 540px;
        height: 35px;
        margin-left: 20px;
        color: black;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        float: left;
    }
    .right_news{
        width: 300px;
        height: 770px;
        float: left;
        margin-top: 20px;
        margin-left: 20px;
    }
    .xuesu{
        width: 300px;
        height: 250px;
        margin-bottom: 10px;
    }
    .right_daohang{
        width: 300px;
        height: 35px;
        background-color: #DDDDDD;
        line-height: 35px;
        margin-bottom: 10px;
        font-size: 16px;
        font-weight: bold;
    }
    .xuesu ul{
        margin: 0;
        padding: 0;
        float: left;
        font-size: 14px;
    }
    .xuesu li{
        width: 200px;
        height: 35px;
        margin-left: 20px;
        color: black;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        float: left;
    }
    .dangjian{
        width: 310px;
        height: 330px;
        margin-bottom: 10px;
    }
    .dangjian ul{
        margin: 0;
        padding: 0;
        float: left;
        font-size: 14px;
    }
    .dangjian li{
        width: 200px;
        height: 35px;
        margin-left: 20px;
        color: black;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        float: left;
    }
    .zhuanti{
        width: 310px;
        height: 150px;
    }
    .zhuanti ul{
        margin: 0;
        padding: 0;
        float: left;
        font-size: 14px;
    }
    .zhuanti li{
        width: 200px;
        height: 35px;
        margin-left: 20px;
        color: black;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        float: left;
    }
    /*底部*/
    footer{
        width: 100%;
        height: 80px;
        background-color: #2a6496;
    }
    .swpu{
        width: 400px;
        height: 80px;
        margin: 0 auto;
        line-height: 80px;
        font-size: 13px;
        color: white;
    }
</style>
</html>